<template>
	<view class="cardBack" @click="toShareBackMoney">
		<view class="title-number" v-for="(item,index) in ListData" :key="index">
			<text class="title">{{item.title}}</text>
			<text class="number">{{item.number}}</text>
		</view>
	</view>
</template>

<script setup>
	import {onMounted, ref} from 'vue'
	import { GetwithDraData } from '../../../config/API/shareBack';
	const ListData = ref([
		{title:'累计收益(元)',number:''},
		{title:'今日获得(元)',number:''},
		{title:'邀请人数',number:''},
	])
	onMounted(async()=>{
		const data = await GetwithDraData()
		console.log('分享返利',data)
		ListData.value[0].number = data.data.total_money
		ListData.value[1].number = data.data.day_money
		ListData.value[2].number = data.data.invite_friend_num
	})
	const toShareBackMoney = () =>{
		uni.navigateTo({
			url:'/myselfSubpages/ShareBackMoney/BackMoney'
		})
	}
</script>

<style lang="scss" scoped>
	.cardBack{
		position: relative;
		z-index: 9;
		margin: 3vh auto;
		margin-bottom: 20rpx;
		width: 95vw;
		border-radius: 10px;
		height: 160rpx;
		background: linear-gradient(to right, rgb(71,74,90), rgb(39,41,53));
		display: flex;
		align-items: center;
		justify-content: space-around;
		.title-number{
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			gap: 8rpx;
			text{
				font-weight: 400;
				color: rgba(255, 255, 255, 1);
			}
			.title{
				font-size: 24rpx;
			}
			.number{
				font-size: 32rpx;
			}
		}
	}
</style>